<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>无标题文档</title>
<link href="style.css" rel="stylesheet" type="text/css">
    <script src="../jquery-3.3.1.min.js"></script>
</head>

<body>

  <div class="con">
   <div class="bt"><img src="images/bt.png" /></div>
   <div class="conn">
     <ul class="clearfix">
      <li><a href="#"><img src="images/a1.png" /></a><p class="p1" id="wendu">0℃</p><p class="p2">温度</p></li>
      <li><a href="#"><img src="images/a2.png" /></a><p class="p1" id="shidu" >80%</p><p class="p2">湿度</p></li>
      <li><a href="#"><img src="images/a3.png" /></a><p class="p1" id="fengsu">80ｍ/ｓ</p><p class="p2">风速</p></li>
      <li><a href="#"><img src="images/a4.png" /></a><p class="p1" id="fengxiang">38°</p><p class="p2">风向</p></li>
      <li><a href="#"><img src="images/a5.png" /></a><p class="p1" id="guangzhaoqd">1</p><p class="p2">光照强度</p></li>
      <li><a href="#"><img src="images/a11.png" /></a><p class="p1" id="rentijc">有</p><p class="p2">人体检测</p></li>
     </ul>
   <div class="line"></div>
   <ul class="clearfix">
      <li><a href="#"><img src="images/a6.png" id="dianziwl"/> </a><p class="p2">电子围栏</p></li>
      <li><a href="#"><img onclick="controlkg()" src="images/a7.png" id="chumokg" name="close"/> </a><p class="p2">触摸开关</p></li>
      <li><a href="#"><img onclick="controlFengshan()" src="images/a8.png" id="oc"  name="close" /></a><p class="p2">风扇</p></li>
      <li><a href="#"><img onclick="controlbjd()" src="images/a9.png" id="ac"  name="close"/></a><p class="p2">报警灯</p></li>
      <li><a href="#"><img onclick="controlfmq()" src="images/a10.png" id="bc"  name="close" /></a><p class="p2">蜂鸣器</p></li>
      <li><a href="#"><img onclick="controldg()" src="images/a12.png" id="dc"  name="close"/></a><p class="p2">灯光控制</p></li>
     </ul>
   </div>
   
   <div class="bottom">版权归中兴教育所有</div>
  </div>

</body>
    <script>
        $(function () {
            setInterval("loadData()",1000);

        })

        function loadData() {
            var url = location.host;
            $.ajax({
                url: "http://" + url + "/view/test/t",
                success: function (result) {
                    var htmlData = ""
                    console.log(result)
                    if(result.data.touchSwitch == "开") {
                        document.getElementById('chumokg').src = "images/a7_h.png";
                        //document.getElementById('ac').src = "images/a9_h.png";
                    }else {
                        document.getElementById('chumokg').src="images/a7.png";
                      //  document.getElementById('ac').src="images/a9_h.png";
                    }
                    if(result.data.temperature != null){
                        $("#wendu").html(`${result.data.temperature}℃`)
                    }
                    if (result.data.humidity != null) {
                        $("#shidu").html(`${result.data.humidity}%`)
                    }
                    if (result.data.windSpeed != null) {
                        $("#fengsu").html(`${result.data.windSpeed}ｍ/ｓ`)
                    }
                    if (result.data.windDirection != null) {
                        $("#fengxiang").html(`${result.data.windDirection}°`)
                    }
                    if (result.data.lightIntensity != null) {
                        $("#guangzhaoqd").html(`${result.data.lightIntensity}lx`)
                    }
                    if (result.data.alarmLamp != null) {
                        $("#ac").html(`${result.data.alarmLamp}`)
                    }
                    if (result.data.infraredInduction != null) {
                        $("#rentijc").html(`${result.data.infraredInduction}`)
                    }

                    if(result.data.alarmLamp == "01"){
                        //打开
                        document.getElementById('ac').src="images/a9_h.png";
                    }else if(result.data.alarmLamp == "00"){
                        //关闭
                        document.getElementById('ac').src="images/a9.png";
                    }

                    if(result.data.beiruqin){
                        document.getElementById('dianziwl').src="images/a6_h.png";
                        document.getElementById('ac').src="images/a9_h.png";
                    }else{
                        document.getElementById('dianziwl').src="images/a6.png";
                        document.getElementById('ac').src="images/a9.png";
                    }

                },
                error: function (error) {
                    console.log(error)
                 //   alert("error")
                }

            })
        }

        function send(id,fun,data,check,end){
            var url = `http://${location.host}/view/test/send?id=${id}&function=${fun}&data=${data}&check=${check}&end=${end}` ;
            $.ajax({
                url: url,
                success: function (result) {
                    var htmlData = ""
                    console.log(result)
                },
                error: function (error) {
                    console.log(error)
                    // alert("error")
                }

            })

        }


        function controlFengshan(){
            //alert(document.getElementById('dc').name)
            if(document.getElementById('oc').name=="close") {
                document.getElementById('oc').name = "open"
                document.getElementById('oc').src="images/a8_h.png"
                send("07","0d","000000000001","5555","a5a5a5")
            }
            else{
                document.getElementById('oc').src = "images/a8.png"
                document.getElementById('oc').name = "close"
                send("07","0d","000000000000","5555","a5a5a5")
            }

        }

        function controlfmq(){
            if(document.getElementById('bc').name=="close") {
                document.getElementById('bc').name = "open"
                document.getElementById('bc').src="images/a10_h.png"
                send("08","0c","000000000001","5555","a5a5a5")
            }
            else{
                document.getElementById('bc').src = "images/a10.png"

                document.getElementById('bc').name = "close"
                send("08","0c","000000000000","5555","a5a5a5")
            }

        }

        function controlbjd(){
            if(document.getElementById('ac').name=="close") {
                document.getElementById('ac').name = "open"
                document.getElementById('ac').src="images/a9_h.png"
                send("07","0b","000000000001","5555","a5a5a5")
            }
            else{
                document.getElementById('ac').src = "images/a9.png"

                document.getElementById('ac').name = "close"
                send("07","0b","000000000000","5555","a5a5a5")
            }

        }

        function controldg(){
            if(document.getElementById('dc').name=="close") {
                document.getElementById('dc').name = "open"
                document.getElementById('dc').src="images/a12_h.png"
                send("08","0e","000000000001","5555","a5a5a5")
            }
            else{
                document.getElementById('dc').src = "images/a12.png"

                document.getElementById('dc').name = "close"
                send("08","0e","000000000000","5555","a5a5a5")
            }

        }


        function controlkg(){
            if(document.getElementById('chumokg').name=="close") {
                document.getElementById('chumokg').name = "open"
                document.getElementById('chumokg').src="images/a7_h.png"
                //send("01","09","000000000001","5555","a5a5a5")
            }
            else{
                document.getElementById('chumokg').src = "images/a7.png"

                document.getElementById('chumokg').name = "close"
                // send("01","09","000000000000","5555","a5a5a5")
            }

        }


    </script>
</html>
